<template>
	<view class="pushProfit-mine">
		<view class="title">
				<text>{{$t('mine.id')}}</text>
				<text>{{$t('mine.myArea.achievement')}}</text>
				<text>{{$t('money.sortsD.Time')}}</text>
			</view>
		<view class="swiper-item">
				<!-- 内容 -->
			<view class="myArea-content">
			<view class="box" v-for="(a,b) in mine" :key="b">
				<text>{{a.id}}</text>
				<text>{{a.achievement}}</text>
				<text>{{a.date}} {{a.time}}</text>
			</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		props:['mine'],
		data() {
			return {
				
			};
		}
	}
</script>

<style>
.sort-bar {
		width: 80vw;
		height: 60rpx;
		display: flex;
		color: black;
		font-weight: 550;
		margin:10rpx auto;
	}

	.sort-bar>view {
		width: 24%;
		height: 100%;
		font-size: 1em;
		line-height: 60rpx;
		text-align: center;
		margin: auto;
	}

	.selected {
		font-weight: 700;
		border-bottom: 8rpx #207DFE solid;
		border-radius: 4rpx;
	}
	scroll-view {
		width: 96vw;
		margin: auto;
		height: calc(40vh - 100rpx);
	}
	
	.swiper {
		width: 100vw;
		height: calc(40vh - 100rpx);
		margin:30rpx auto;
	}
	swiper-item{
		width: 100%;
	}
	.title{
		 margin: -6rpx 60rpx;
		display: flex;
		justify-content: space-between;
	}
	.box{
			width: 100%;
			height: 70rpx;
			display: flex;
			justify-content: space-between;
			border-bottom: 2rpx solid #F3F3F3;
			font-size: .95em;
			background-color: #FFFFFF;
		}
		.box>text:nth-of-type(1){
			position: relative;
			left: 60rpx;
			 font-weight: 500; 
			 line-height: 80rpx;
		}
		.box>text:nth-of-type(2){
			position: relative;
			left: 24rpx;
			 font-weight: 500; 
			 line-height: 80rpx;
		}
		.box>text:nth-of-type(3){
			position: relative;
			left: -40rpx;
			font-size: .8em;
			opacity: .7;
			line-height: 80rpx;
		}
</style>
